<!-- eslint-disable vue/multi-word-component-names -->
<script setup>
import { createRouter as $router } from 'vue-router'
</script>

<template>
  <div class="not-found-page">
    <el-result
      icon="warning"
      title="404 页面未找到"
      sub-title="你找的页面走丢了~"
    >
      <template #extra>
        <el-button
          type="primary"
          size="large"
          @click="$router.push('/')"
          class="home-button"
        >
          返回首页
        </el-button>
      </template>
    </el-result>
  </div>
</template>

<style scoped>
.not-found-page {
  display: flex;
  justify-content: center;
  align-items: center;
  height: 100vh;
  background: #f5f5f5; /* 淡灰色背景 */
}
</style>
